<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>
  
  <script>

    var name = "window"

    function Person(name) {
      this.name = name
      this.foo1 = function () {
        console.log(this.name);
      },
      this.foo2 = () => console.log(this.name),
      this.foo3 = function () {
        return function () {
          console.log(this.name);
        }
      },
      this.foo4 = function () {
        return () => {
          console.log(this.name);
        }
      }
    }

    var person1 = new Person("person1")
    var person2 = new Person("person2")

    person1.foo1()  //person1
    person1.foo1.call(person2)  //person2

    person1.foo2()  // person1
    person1.foo2.call(person2)  //箭头函数没有this 回去上层作用域查找 person2

    person1.foo3()()  //window
    person1.foo3().call(person2)()  //返回函数之后默认绑定 window
    person1.foo3().call(person2)  //person2

    person1.foo4()()  //person1
    person1.foo4.call(person2)()  //person2  绑定person2之后调用返回方法
    person1.foo4().call(person2)  //person1
  </script>
</body>
</html>